<!--JVM信息-->
<template>
  <div class="app-container">
    <!--列表-->
    <div class="table-container flex-main">
      <div class="table-container-header">
        <el-alert
          type="success"
          show-icon
          :closable="false">
          <div slot="title">
            上次更新时间：{{ updateTime | formatDate(T.DATE_TIME_FMT1) }}
            <el-divider direction="vertical" />
            <el-link type="primary" :underline="false" @click="handleClickUpdate">立即更新</el-link>
          </div>
        </el-alert>
      </div>
      <el-table
        ref="multipleTable"
        :data="dataSource"
        row-key="id"
        header-cell-class-name="table-header"
        fit
        height="100%"
        highlight-current-row>
        <el-table-column label="参数" prop="param" align="left" min-width="200">
          <template slot-scope="scope">
            <span :class="'color-'+textInfo[scope.row.param].color">{{ scope.row.param }}</span>
          </template>
        </el-table-column>
        <el-table-column label="描述" prop="text" align="left" min-width="200" show-overflow-tooltip>
          <template slot-scope="scope">
            {{ textInfo[scope.row.param].text }}
          </template>
        </el-table-column>
        <el-table-column align="left" prop="value" label="当前值" min-width="200">
          <template slot-scope="scope">
            {{ scope.row.value }} {{ textInfo[scope.row.param].unit }}
          </template>
        </el-table-column>
      </el-table>
    </div>

  </div>
</template>
<script>
export default {
  data() {
    return {

      updateTime: new Date().getTime(),
      dataSource: [],
      textInfo: {
        'jvm.memory.max': { color: 'primary', text: 'JVM 最大内存', unit: 'MB' },
        'jvm.memory.committed': { color: 'primary', text: 'JVM 可用内存', unit: 'MB' },
        'jvm.memory.used': { color: 'primary', text: 'JVM 已用内存', unit: 'MB' },
        'jvm.buffer.memory.used': { color: 'danger', text: 'JVM 缓冲区已用内存', unit: 'MB' },
        'jvm.buffer.count': { color: 'danger', text: '当前缓冲区数量', unit: '个' },
        'jvm.threads.daemon': { color: 'success', text: 'JVM 守护线程数量', unit: '个' },
        'jvm.threads.live': { color: 'success', text: 'JVM 当前活跃线程数量', unit: '个' },
        'jvm.threads.peak': { color: 'success', text: 'JVM 峰值线程数量', unit: '个' },
        'jvm.classes.loaded': { color: 'warning', text: 'JVM 已加载 Class 数量', unit: '个' },
        'jvm.classes.unloaded': { color: 'warning', text: 'JVM 未加载 Class 数量', unit: '个' },
        'jvm.gc.memory.allocated': { color: 'default', text: 'GC 时, 年轻代分配的内存空间', unit: 'MB' },
        'jvm.gc.memory.promoted': { color: 'default', text: 'GC 时, 老年代分配的内存空间', unit: 'MB' },
        'jvm.gc.max.data.size': { color: 'default', text: 'GC 时, 老年代的最大内存空间', unit: 'MB' },
        'jvm.gc.live.data.size': { color: 'default', text: 'FullGC 时, 老年代的内存空间', unit: 'MB' },
        'jvm.gc.pause.count': { color: 'primary', text: '系统启动以来GC 次数', unit: '次' },
        'jvm.gc.pause.totalTime': { color: 'primary', text: '系统启动以来GC 总耗时', unit: '秒' }
      },
      // 当一条记录中需要取出多条数据的时候需要配置该字段
      moreInfo: {
        'jvm.gc.pause': ['.count', '.totalTime']
      }
    }
  },
  created() {
    this.loadJVMInfo()
  },
  methods: {
    handleClickUpdate() {
      this.loadJVMInfo()
    },
    loadJVMInfo() {
      this.updateTime = new Date().getTime()
      this.dataSource = []
      this.$store.dispatch('monitorJVMInfo', { loading: false }).then(res => {
        const jvmInfo = []
        res.forEach((value, id) => {
          let more = this.moreInfo[value.name]
          if (!(more instanceof Array)) {
            more = ['']
          }
          more.forEach((item, idx) => {
            const param = value.name + item
            let val = value.measurements[idx].value

            if (param === 'jvm.memory.max' ||
                param === 'jvm.memory.committed' ||
                param === 'jvm.memory.used' ||
                param === 'jvm.buffer.memory.used' ||
                param === 'jvm.gc.memory.allocated' ||
                param === 'jvm.gc.memory.promoted' ||
                param === 'jvm.gc.max.data.size' ||
                param === 'jvm.gc.live.data.size'
            ) {
              val = this.convert(val, Number)
            }
            jvmInfo.push({ id: param + id, param, text: 'false value', value: val })
          })
        })
        this.dataSource = jvmInfo
      }).catch((_) => {})
    },
    convert(value, type) {
      if (type === Number) {
        return Number(value / 1048576).toFixed(3)
      } else if (type === Date) {
        return this.T.formatDate(value * 1000, 'yyyy-MM-dd hh:mm:ss')
      }
      return value
    }
  }

}
</script>
